window.onload = function() {
    let cases = document.querySelectorAll('.case')
    console.log(cases);
    let lis = document.querySelectorAll('.caseaside>li')
    console.log(lis);
    // //遍历lis
    // lis.forEach(function(li, index) {
    //         //添加点击事件
    //         li.addEventListener('click', function() {
    //             lis.forEach(function(li) {
    //                 li.classList.remove('active')
    //             })
    //             this.classList.add('active')
    //             document.documentElement.scrollTop = cases[index].offsetTop
    //         })
    //     })
    // 再点击事件中
    lis.forEach(function(li, index) {
        li.addEventListener('click', function() {
            lis.forEach(function(li) {
                li.classList.remove('active')
            })
            this.classList.add('active')

            //1获取当前滚动距离--
            let current = document.documentElement.scrollTop
                //2.获取目标滚动距离----- 目标楼层的offsetTop
            let target = cases[index].offsetTop
            console.log(current, target);
            //3. 每隔一段时间，滚动10px
            if (target > current) {
                let timerId = setInterval(function() {
                    current += 10
                    console.log(current);
                    // 设置滚动距离
                    document.documentElement.scrollTop = current

                    //判断目标距离和当前之间差距，如果这个差距小于30px
                    if (target - current < 30) {
                        //清除定时器
                        clearInterval(timerId)
                        timerId = null
                            //手动设置
                        document.documentElement.scrollTop = target
                    }

                }, 10)
            } else {

                let timerId = setInterval(function() {
                    current -= 10
                    console.log(current);
                    // 设置滚动距离
                    document.documentElement.scrollTop = current

                    //判断目标距离和当前之间差距，如果这个差距的绝对值小于30px
                    if (current - target < 30) {
                        //清除定时器
                        clearInterval(timerId)
                        timerId = null
                            //手动设置
                        document.documentElement.scrollTop = target
                    }

                }, 10)
            }

        })
    })
}